<%@page import="org.springframework.web.context.request.SessionScope"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix="mvc" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="spring" uri="http://www.springframework.org/tags" %>  
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>  
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>   
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Questionnaires</title>  
<link rel="stylesheet" href="common/css/pintuer.css">
<link rel="stylesheet" href="component/bootstrap-3.3.7-dist/css/bootstrapUI.css">
<link rel="stylesheet" href="common/css/popupUI.css">
<script type="text/javascript" src="component/jquery1.4.4.js"></script>	
<!-- <script src="http://code.jquery.com/jquery-1.4.4.min.js" type="text/javascript"></script> -->
<script type="text/javascript" src="common/js/questionnaire/allQuestionnaire.js"></script>
</head>
<body>
<div class="admin">
    <div class="panel admin-panel">
    	<div class="panel-head" style="text-align:center"><strong >Questionnaire List</strong></div>
        <div class="padding border-bottom" >
       <!--    =========================================================================   -->
        <span id="fusionSearch" style="dispaly:inline" style="align:left">
		<form style="display:inline" action="fusionSearchQuestionnaire.action?number=1">
		<input name="number" type="hidden" value=1 />
		     <input id="questionnaireStatusHidden" type="hidden" value="${sessionScope.questionnaireStatus}" />
		     <input id="questionnaireCategoryHidden" type="hidden" value="${sessionScope.questionnaireCategory}" />
		<label style="font-weight:lighter;">问卷名:</label>
			<input class="input" style="display:inline;width:100px" name="questionnaireName" id="questionnaireName" type="text" placeholder="输入关键字" style="width:100px" value="${questionnaireName}">
		<label style="margin-left:20px;font-weight:lighter;">状态:</label>
			<select class="input" style="display:inline;width:50px;cursor:pointer" name="questionnaireStatus" id="questionnaireStatus">
				   <option id="status2" value="2">全部</optioin>
			       <option id="status0" value="0">关闭</optioin> 
			       <option id="status1" value="1">打开</optioin>
        	</select>
		<label style="margin-left:20px;font-weight:lighter;">种类:</label>
			<select class="input" style="display:inline;width:60px;cursor:pointer" name="questionnaireCategory" id="questionnaireCategory">
			       <option id="category0" value="0">全部</optioin>
			       <option id="category1" value="1">生活类</optioin> 
			       <option id="category2" value="2">工作类</optioin>
			       <option id="category3" value="3">社会类</optioin>
        	</select>
		<label style="margin-left:20px;font-weight:lighter;">创建时间:</label>
			<input class="input" style="display:inline;width:160px;cursor:pointer" name="timeStart" id="timeStart" type="date"  value="${sessionScope.timeStart}"><label style="margin-left:10px;font-weight:lighter;">到</label>
			<input class="input" style="display:inline;width:160px;margin-left:5px;cursor:pointer" name="timeEnd" id="timeEnd" type="date"  value="${sessionScope.timeEnd}">
			<input type="submit" style="margin-left:10px" class="button button-small border-blue" value="搜索"/>
			</form>
		</span>
		
		<!--    =========================================================================   -->
            <a type="button" class="button button-small border-blue" id="addQues" style="margin-left:250px">ADD</a>
           <a id="deleteButton" type="button" class="button button-small border-yellow " style="margin-left:10px">DELETE CHECKED</a>
        </div>
        <table class="table table-hover" style="table-layout:fixed">
        	<tr>
        	<th width="10" style="text-align:left"><input id="checkAll" type="checkbox"></th>
        	<th width="30" style="text-align:left">NO</th>
        	<th width="80" style="text-align:left">NAME</th>
        	<th width="100" style="text-align:left">DEADLINE</th>
        	<th width="60" style="text-align:left">STATUS</th>
        	<th width="100" style="text-align:left">CATEGORY</th>
        	<th width="100" style="text-align:left">ACTION</th>
        	</tr>
        	<% Integer listCountNumber = (Integer)session.getAttribute("number");
        	listCountNumber=listCountNumber*5-4;%> 
             <c:if test="${!empty questionnaireList }">  
                <c:forEach items="${questionnaireList}" var="questionnaire">  
                    <tr>
                    	<td style="text-align:left"><input name="subBox" type="checkbox" value="${questionnaire.questionnaireId}"></td>
                        <td style="text-align:left"><%=listCountNumber++ %></td>
                        <%-- <td style="white-space:nowrap;overflow:hidden;width:100px"><a id="onmouseoverText" href="getQuestionByQuestionnaire.action?questionnaireId=${questionnaire.questionnaireId}">${questionnaire.questionnaireName }</a></td> --%>
                        <td style="text-align:left;white-space:nowrap;overflow:hidden"><a id="onmouseoverText" href="getQuestionByQuestionnaire.action?questionnaireId=${questionnaire.questionnaireId}">${questionnaire.questionnaireName }</a></td>
                        <td style="text-align:left;white-space:nowrap;overflow:hidden"><fmt:formatDate value="${questionnaire.questionnaireDeadline}" pattern="yyyy-MM-dd"/></td>  
                        <td style="text-align:left;white-space:nowrap;overflow:hidden">
                        <c:if test= "${questionnaire.questionnaireStatus==true}">
                        <c:out value="OPEN"/>
                        </c:if>
                        <c:if test= "${questionnaire.questionnaireStatus==false}">
                        <c:out value="CLOSED"/>
                        </c:if>
                        </td>
                        <td style="text-align:left;white-space:nowrap;overflow:hidden"> 
                        <c:if test= "${questionnaire.questionnaireCategory==1}">
                        <c:out value="生活类"/>
                        </c:if>
                        <c:if test= "${questionnaire.questionnaireCategory==2}">
                        <c:out value="工作类"/>
                        </c:if>
                        <c:if test= "${questionnaire.questionnaireCategory==3}">
                        <c:out value="社会类"/>
                        </c:if>
                        </td>
                        <td style="text-align:left">  
                       <%--  <a class="button border-blue button-little" onclick="window.location='toEditQuestionnaire.action?questionnaireId=${questionnaire.questionnaireId}'"><spring:message code="Edit"/></a>  --%>
                        <a class="button border-blue button-little editQuestionnaireButton" style="cursor:pointer"><input class="questionnaireIdCurrent" type="hidden" value="${questionnaire.questionnaireId}"><spring:message code="Edit"/></a> 
                        <a class="button border-yellow button-little deleteQuestionnaireSingle" style="cursor:pointer" ><input class="questionnaireIdCurrent" type="hidden" value="${questionnaire.questionnaireId}"><spring:message code="Delete"/></a>
                        <%-- <a class="button border-yellow button-little" style="cursor:pointer" onclick="window.location='deleteQuestionnaire.action?questionnaireId=${questionnaire.questionnaireId}'"><spring:message code="Delete"/></a> --%>
                        </td>  
                    </tr>               
                </c:forEach>  
            </c:if>  
          </table>
          
          <div class="panel-foot text-right">
           <ul class="pagination"><li><a href="fusionSearchQuestionnaire.action?number=1&questionnaireStatus=${sessionScope.questionnaireStatus}&questionnaireCategory=${sessionScope.questionnaireCategory}&timeStart=${sessionScope.timeStart}&timeEnd=${sessionScope.timeEnd}&questionnaireName=${sessionScope.questionnaireName}"><spring:message code="FirstPage"/></a></li></ul>
            <ul class="pagination"><li><a href="fusionSearchQuestionnaire.action?number=${sessionScope.number-1}&questionnaireStatus=${sessionScope.questionnaireStatus}&questionnaireCategory=${sessionScope.questionnaireCategory}&timeStart=${sessionScope.timeStart}&timeEnd=${sessionScope.timeEnd}&questionnaireName=${sessionScope.questionnaireName}"><spring:message code="Last"/></a></li></ul>
            <ul class="pagination"><li><a href="fusionSearchQuestionnaire.action?number=${sessionScope.number+1}&questionnaireStatus=${sessionScope.questionnaireStatus}&questionnaireCategory=${sessionScope.questionnaireCategory}&timeStart=${sessionScope.timeStart}&timeEnd=${sessionScope.timeEnd}&questionnaireName=${sessionScope.questionnaireName}"><spring:message code="Next"/></a></li></ul>
               <ul class="pagination"><li><a href="fusionSearchQuestionnaire.action?number=${sessionScope.count}&questionnaireStatus=${sessionScope.questionnaireStatus}&questionnaireCategory=${sessionScope.questionnaireCategory}&timeStart=${sessionScope.timeStart}&timeEnd=${sessionScope.timeEnd}&questionnaireName=${sessionScope.questionnaireName}"><spring:message code="Final"/></a></li></ul>
              <font style="line-height:2.5"><spring:message code="currentpage"/>${sessionScope.number}/${sessionScope.count}</font>
        </div>
     </div>
  </div> 
  
  	<!-- popup add -->
	<div class="fullScreen" id="addQuestionnairePopup" >
		<div class="modal-content">
			<div class="popup">
				<div class="modal-header" style="height:50">
					<div class="row">
						<div class="col col-md-11" id="articleTitle">
					<h3 class='modal-title' style="font-size:18px;color:gray;padding:10px 10px">Add Questionnaire</h3>
						</div>
						<div class="col-md-1">
							<button type="button" class="close close-lg" id="closePopup">×</button>
						</div>
					</div>
				</div>
				<div id="MailerContentArea"  style="height:300px;overflow:hidden;">
					<div class="mailerContent" id="articleContentIndex">
						<%-- ${content} --%>

							<div class="tab-panel active" id="tab-set">
								<form action="addQuestionnaire.action" method="post"
									name="questionnaire" class="form-x">

									<div class="form-group" style="margin-top:20px;">
										<div class="label">
											<label style="color:black;font-weight:lighter;">Name:</label>
										</div>
										<div class="field">
											<input type="text" class="input" id="siteurl"
												name="questionnaireName" size="50" placeholder="Name"
												data-validate="required:请填写网址" />
										</div>
									</div>

								
									<div class="form-group">
										<div class="label">
											<label style="color:black;font-weight:lighter;">Status:</label>
										</div>
										<div class="field" >
											<select class="input" style="display:inline;width:60px;cursor:pointer" name="questionnaireStatus">
												<option value="1">Open</option>
												<option value="0">Closed</option>
											</select>
										</div>
									</div>
									
									
									<div class="form-group">
										<div class="label">
											<label style="color:black;font-weight:lighter;">Category:</label>
										</div>
										<div class="field">
											<select class="input" style="display:inline;width:60px;cursor:pointer" name="questionnaireCategory">
												<option value="1">生活类</option>
												<option value="2">工作类</option>
												<option value="3">社会类</option>
											</select>
										</div>
									</div>
									
						
							<div class="form-group">
										<div class="label">
											<label style="color:black;font-weight:lighter;">Deadline:</label>
										</div>
										<div class="field">
											<input type="date" class="input" style="display:inline;width:160px;cursor:pointer" name="questionnaireDeadline"
												placeholder="Deadline" /><br>
										</div>
									</div>
									<input type="submit" value="Add " class="button button-small border-blue" style="margin-left:400px;"/>
								</form>
							</div>
						</div>


				</div> 
			</div>
		</div>		
	</div>
	
  <!-- popup edit -->
  <div class="fullScreen" id="editQuestionnairePopup" >
		<div class="modal-content">
			<div class="popup">
				<div class="modal-header" style="height:50">
					<div class="row">
						<div class="col col-md-11" id="articleTitle">
					<h3 class='modal-title' style="font-size:18px;color:gray;padding:10px 10px">Add Questionnaire</h3>
						</div>
						<div class="col-md-1">
							<button type="button" class="close close-lg" id="closeEditPopup">×</button>
						</div>
					</div>
				</div>
				<div id="MailerContentArea"  style="height:300px;overflow:hidden;">
					<div class="mailerContent" id="articleContentIndex">
						<%-- ${content} --%>

							<div class="tab-panel active" id="tab-set">
								<form action="editQuestionnaire.action" method="post"
									name="questionnaire" class="form-x">

									<div class="form-group" style="margin-top:20px;">
										<div class="label">
											<label style="color:black;font-weight:lighter;">Name:</label>
										</div>
										<div class="field">
											<input type="text" class="input" id="questionnaireNameEdit"
												name="questionnaireName" size="50" placeholder="Name"
												data-validate="required:请填写"  value=""/>
										</div>
									</div>

								
									<div class="form-group">
										<div class="label">
											<label style="color:black;font-weight:lighter;">Status:</label>
										</div>
										<div class="field" >
											<select class="input" style="display:inline;width:60px;cursor:pointer" name="questionnaireStatus">
												<option id="questionnaireStatusOpen" value="1">Open</option>
												<option id="questionnaireStatusClosed" value="0">Closed</option>
											</select>
										</div>
									</div>
									
									
									<div class="form-group">
										<div class="label">
											<label style="color:black;font-weight:lighter;">Category:</label>
										</div>
										<div class="field">
											<select class="input" style="display:inline;width:60px;cursor:pointer" name="questionnaireCategory">
												<option id="questionnaireCategory1" value="1">生活类</option>
												<option id="questionnaireCategory2" value="2">工作类</option>
												<option id="questionnaireCategory3" value="3">社会类</option>
											</select>
										</div>
									</div>
									
						
							<div class="form-group">
										<div class="label">
											<label style="color:black;font-weight:lighter;">Deadline:</label>
										</div>
										<div class="field">
											<input id="questionnaireDeadlineEdit" type="date" class="input" style="display:inline;width:160px;cursor:pointer" name="questionnaireDeadline"
												placeholder="Deadline" value=""/><br>
										</div>
									</div>
									<input type="submit" value="Save " class="button button-small border-blue" style="margin-left:400px;"/>
								</form>
							</div>
						</div>


				</div> 
			</div>
		</div>		
	</div>
  
  <!-- 多删除弹窗 -->
	<div class="fullScreen" id="deleteQusPopup" >
		<div class="modal-content" style="height:250px;width:350px;margin-left:18%;border-radius:5px;" >
			<div class="popup">
			<div class="modal-header" style="height:20px;background-color:white;border-bottom:0px;">
			<div style="margin-left:20px;margin-top:90px;font-size:20px;">Are you sure to delete these data? </div>
			
			<button type="button" id="cancel" class="button button-small border-blue" style="margin-top:40px;margin-left:60px;width:100px;height:40px;font-size:16px;">Cancel</button>
			
			<button type="button" id="sureDeleteButton" class="button button-small border-blue" style="margin-left:30px;margin-top:40px;width:100px;height:40px;font-size:16px;">Sure</button>
			
		
				</div> 
			</div>
		</div>		
	</div>
	<!-- 未选弹窗 -->
	<div class="fullScreen" id="NoChecked" >
		<div class="modal-content" style="height:250px;width:350px;margin-left:18%;border-radius:5px;" >
			<div class="popup">
			<div class="modal-header" style="height:20px;background-color:white;border-bottom:0px;">
			<div style="text-align:center;margin-top:90px;font-size:20px">Nothing selected!!</div>
			<button type="button" id="noChosedClose" class="button button-small border-blue" style="margin-left:120px;margin-top:40px;text-align:center; width:100px;height:40px;font-size:16px;">OK</button>
				</div> 
			</div>
		</div>		
	</div>
	<!-- 单个问卷删除弹窗 -->
  <div class="fullScreen" id="deleteSingleQues" >
		<div class="modal-content" style="height:250px;width:350px;margin-left:18%;border-radius:5px;" >
			<div class="popup">
			<div class="modal-header" style="height:20px;background-color:white;border-bottom:0px;">
			<div style="margin-left:20px;margin-top:90px;font-size:20px;">Are you sure to delete the data? </div>
			
			<button type="button" id="cancelSingleQues" class="button button-small border-blue" style="margin-top:40px;margin-left:60px;width:100px;height:40px;font-size:16px;">Cancel</button>
			
			<button type="button" id="sureSingleQues" class="button button-small border-blue" style="margin-left:30px;margin-top:40px;width:100px;height:40px;font-size:16px;">Sure</button>
			
		
				</div> 
			</div>
		</div>		
	</div>
  
</body>
</html>